$theme-color: #00c6c1;
$theme-color-mid: #ccf4f3;
$theme-color-light: #e6f9f9;

$menu-icon-light-hover-red: $theme-color;
$menu-text-light-hover-red: $theme-color;

$menu-bg-active-red: $theme-color;
$menu-icon-light-active-red: $theme-color;
$menu-text-light-active-red: $theme-color;
$menu-bg-light-active-red: $theme-color-light;

$theme-color-button-hover: rgb(0, 198, 193, 0.8);

.learun-theme-color-cyan {

  // 菜单
  .learun-el-menu,
  .learun-more-dark-el-menu,
  .learun-more-light-el-menu {

    .el-menu-item,
    .el-submenu__title {
      &.is-active {
        &:before {
          content: '';
          background: $menu-bg-active-red;
        }
      }
    }
  }

  .learun-el-menu {
    &-collapse {
      &.el-menu>.el-submenu {
        &.is-active>.el-submenu__title {
          &:before {
            content: '';
            background: $menu-bg-active-red;
          }
        }
      }
    }

    /*横向菜单*/
    &.el-menu--horizontal {
      &.el-menu>.el-submenu {
        &.is-active>.el-submenu__title {
          &:before {
            content: '';
            background: $menu-bg-active-red;
          }
        }
      }
    }
  }

  .learun-el-menu-light {

    .el-menu-item,
    .el-submenu__title {
      &:hover {
        .el-menu__text {
          color: $menu-text-light-hover-red;
        }

        .el-menu__icon {
          color: $menu-icon-light-hover-red;
        }
      }

      &.is-active {
        .el-menu__icon {
          color: $menu-icon-light-active-red;
        }

        .el-menu__text {
          color: $menu-text-light-active-red;
        }

        &:before {
          background: $menu-bg-light-active-red;
        }
      }
    }

    &.learun-el-menu-collapse,
    &.el-menu--horizontal {
      &.el-menu>.el-submenu {
        &.is-opened>.el-submenu__title {
          .el-menu__icon {
            color: $menu-icon-light-hover-red;
          }

          .el-menu__text {
            color: $menu-text-light-hover-red;
          }
        }

        &.is-active>.el-submenu__title {
          background-color: transparent;

          .el-menu__icon {
            color: $menu-icon-light-active-red;
          }

          .el-menu__text {
            color: $menu-text-light-active-red;
          }

          &:before {
            content: '';
            background: $menu-bg-light-active-red;
          }
        }
      }
    }
  }

  .learun-more-dark-el-menu {
    .el-submenu {
      &.is-active>.el-submenu__title {
        &:before {
          content: '';
          background: $menu-bg-active-red;
        }
      }
    }
  }

  .learun-more-light-el-menu {

    .el-menu-item,
    .el-submenu__title {
      &:hover {
        .el-menu__icon {
          color: $menu-icon-light-hover-red;
        }

        .el-menu__text {
          color: $menu-text-light-hover-red;
        }
      }

      &.is-active {
        .el-menu__icon {
          color: $menu-icon-light-active-red;
        }

        .el-menu__text {
          color: $menu-text-light-active-red;
        }

        &:before {
          background: $menu-bg-light-active-red;
        }
      }
    }

    .el-submenu {
      &.is-opened>.el-submenu__title {

        .el-menu__icon,
        .el-submenu__icon-arrow {
          color: $menu-icon-light-hover-red;
        }

        .el-menu__text {
          color: $menu-text-light-hover-red;
        }
      }

      &.is-active>.el-submenu__title {

        .el-menu__icon,
        .el-submenu__icon-arrow {
          color: $menu-icon-light-active-red;
        }

        .el-menu__text {
          color: $menu-text-light-active-red;
        }

        &:before {
          content: '';
          background: $menu-bg-light-active-red;
        }
      }
    }
  }


  // 头像
  .learun-header .el-avatar {
    background-color: $theme-color;
  }

  &.learun-theme-color-type-white .learun-header .el-avatar,
  &.learun-theme-color-type-color .learun-header .el-avatar,
  &.learun-theme-nav-side2 .learun-header .el-avatar,
  &.learun-theme-nav-side3 .learun-header .el-avatar {
    background-color: $theme-color-light;
    color: $theme-color;
  }


  /*菜单选项卡调整*/
  .learun-tags {
    .el-tabs--card>.el-tabs__header .el-tabs__item {
      &:after {
        background: $theme-color;
      }

      &.is-active {
        color: $theme-color;
        background-color: $theme-color-light;
      }

      &:hover {
        color: $theme-color;
      }

      .el-icon-close:hover {
        background-color: $theme-color !important;
      }
    }
  }

  .learun-tags__contentmenu .item:hover {
    background: $theme-color-light;
    color: $theme-color;
  }

  // 页面侧边栏
  .learun-side-item.selected {
    background: $theme-color-light !important;
    color: $theme-color !important;
  }

  .l-edit-table--addbtn:hover {
    border-color: $theme-color;
  }

  // 树形
  .el-tree-node__content:hover {
    background-color: $theme-color-light;
    color: $theme-color;

    i {
      color: $theme-color;
    }
  }




  // 按钮
  .el-button--text:not(.l-fullscreen-dialog-close) {
    color: $theme-color;
  }

  .el-button--text:not(.l-fullscreen-dialog-close, .learun-text-btn):focus,
  .el-button--text:not(.l-fullscreen-dialog-close, .learun-text-btn):hover {
    border-color: transparent !important;
    background-color: transparent !important;
  }

  .vxe-body--row .el-dropdown-link {
    color: $theme-color;
  }


  .el-button--primary {
    background-color: $theme-color;
    border-color: $theme-color;
  }

  .el-button--primary.is-disabled,
  .el-button--primary.is-disabled:active,
  .el-button--primary.is-disabled:focus,
  .el-button--primary.is-disabled:hover {
    background-color: $theme-color-light;
    border-color: $theme-color-light;
  }

  .el-button--default:focus,
  .el-button--default:hover {
    color: $theme-color;
    border-color: $theme-color-mid;
    background-color: $theme-color-light;
  }

  .el-button--primary:focus,
  .el-button--primary:hover {
    background: $theme-color-button-hover;
    border-color: $theme-color-button-hover;
    color: #fff;
  }

  .el-button--primary.is-plain {
    color: $theme-color;
    background: $theme-color-light;
    border-color: $theme-color-mid;
  }

  .el-button--primary.is-plain:focus,
  .el-button--primary.is-plain:hover {
    background: $theme-color;
    border-color: $theme-color;
    color: #fff;
  }




  .el-switch.is-checked .el-switch__core {
    border-color: $theme-color;
    background-color: $theme-color;
  }

  .el-radio-button__orig-radio:checked+.el-radio-button__inner {
    background-color: $theme-color;
    border-color: $theme-color;
    -webkit-box-shadow: -1px 0 0 0 $theme-color;
    box-shadow: -1px 0 0 0 $theme-color;
  }

  .el-radio__input.is-checked+.el-radio__label {
    color: $theme-color;
  }

  .el-radio__input.is-checked .el-radio__inner {
    border-color: $theme-color;
    background: $theme-color;
  }



  .el-dropdown-menu__item:focus,
  .el-dropdown-menu__item:not(.is-disabled):hover {
    background-color: $theme-color-light;
    color: $theme-color;
  }

  .el-tree-node.is-current>.el-tree-node__content {
    background: $theme-color-light;
    color: $theme-color;
  }


  .el-tabs__item.is-active {
    color: $theme-color;
  }

  .el-tabs__item:hover {
    color: $theme-color;
  }

  .el-tabs__active-bar {
    background-color: $theme-color;
  }


  .el-slider__bar {
    background-color: $theme-color;
  }

  .el-slider__button {
    border: solid 2px $theme-color;
  }


  .el-input__inner:focus {
    outline: 0;
    border-color: $theme-color;
  }

  // 步骤条
  .el-step__head.is-process {
    border-color: $theme-color;

    .el-step__icon {
      background-color: $theme-color;
    }
  }

  .el-step__title.is-process {
    color: $theme-color;
  }
}